<template>
	<div class="page">
		<van-nav-bar title="消费记录" left-text="返回" fixed left-arrow @click-left="back" />
		<van-list v-model="loading" :finished="finished" @load="getList"  style="margin-top:55px">
      <van-cell-group>
        <van-cell :title="item.goodsname" :value="'消费：'+item.integral+' 积分'" :label="'兑换时间：'+item.time" v-for="item in list.Items"/>
      </van-cell-group>
			<div class="finished" v-if="finished">加载完毕</div>
		</van-list>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				list:{
					CurrentPage:0,
					ItemsPerPage:0,
					Items:[]
				},
				loading: false,
				finished: false
			};
		},
		mounted:function(){	
//			console.log(this.httpUrl);

		},
		methods: {
			getList(){
				this.$http.get(this.httpUrl+"/Consume/mine",{params:{page:this.list.CurrentPage+1}}).then((response) => {	
				  this.list.CurrentPage=response.data.CurrentPage;
				  this.list.TotalPages=response.data.TotalPages;
				  for (let i = 0; i < response.data.Items.length; i++) {
						this.list.Items.push(response.data.Items[i]);
        			}
				  this.loading = false;
				  if (this.list.CurrentPage >= this.list.TotalPages) {
			          this.finished = true;
			      }
				 }).catch(function (error) {
				    console.log(error);
				  })
			},
			back() {
				this.$router.go(-1); //返回上一层
			}
		}
	};
</script>

<style>

.learnDiv{ width: 50%;padding:10px; display: inline-block;box-sizing: border-box;}
.learnDiv .price{ color: #EE383D}
.learnDiv a{  float: left;}
.learnDiv .pic{border-radius:5px;overflow: hidden;width: 100%;width: 100%; height:7rem; position: relative;border-radius:5px ;}
.learnDiv .bm{ height: 20px;line-height: 20px;position: absolute; width:80px;font-size:6px; color: #FFFFFF;background: #EE383D; text-align:center;transform:rotate(-45deg);top:10px;left:-20px;}
.learnDiv .hd{ height: 20px;line-height: 20px;position: absolute; width:80px;font-size:6px; color: #FFFFFF;background: #F09F33; text-align:center;transform:rotate(-45deg);top:10px;left:-20px;}
.learnDiv .pic img{ width: 100%; height:7rem; border-radius:5px;}
.learnDiv h3{height:1rem;line-height: 1rem;overflow: hidden;display: -webkit-box;-webkit-line-clamp:1;-webkit-box-orient: vertical;margin:0.7rem 0rem 0.5rem 0rem;font-size:1rem;color: #333;}
.learnDiv p{ color: #999;font-size: 12px;height:1.2rem;overflow: hidden;display: -webkit-box;-webkit-line-clamp:1;-webkit-box-orient: vertical}


.van-tabs--tabtt{margin: 20px 20px 0 20px;height: 30px;border-radius:15px; overflow:hidden;}
.van-tabs--tabtt .van-tab{height: 30px; line-height: 30px;background: #f4f4f4;}
.van-tabs--tabtt .van-tab--active{border-radius:15px;background:#EE383D; color: #fff; overflow: hidden;}
.van-tabs__nav{background:none;}

</style>